<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>jquery练习</title>
		<script type="text/javascript" src="../js/jquery-produce-3.1.0.min.js"></script>
		<script language="JavaScript" src="../js/index.js"></script>
		<link rel="stylesheet" href="../css/index.css" />
	</head>
	<body>
		<h2>This is a heading</h2>
		<p>This is a paragraph.</p>
		<p id="test">This is another paragraph.</p>
		<button class="but1" type="button" onclick="click1()">Click me</button>
		<button class="but2" type="button" onclick="click2()">Click me1</button>
		
		<p id="p1">如果点击“隐藏”按钮，我就会消失。</p>
		<button id="hide" type="button" onclick="hide()">隐藏</button>
		<button id="show" type="button" onclick="show()">显示</button>
		
		<p id="p2">如果点击“隐藏”按钮，我会慢慢的消失。</p>
		<button id="hide1" type="button" onclick="hide1()">slow隐藏</button>
		<button id="show1" type="button" onclick="show1()">slow显示</button>
		
		<p class="p3">这是一个段落。</p>
		<p class="p3">这是另一个段落。</p>
		<button id="slide" type="button" onclick="slide()">切换</button>
		
		<p id="p4">演示带有不同参数的fadeIn()方法。</p>
		<div id="div1"></div>
		<br/>
		<div id="div2"></div>
		<br/>
		<div id="div3"></div>
		<button id="but3" type="button" onclick="fadeIn();fadeOut()">点击这里，使三个矩形淡入</button>
		<button id="but4" type="button" onclick="fadeToggle()">点击这里，使三个矩形淡入淡出</button>
		<button id="but5" type="button" onclick="fadeTo()">点击这里，使三个矩形淡出</button>
		
		<div class="panel">
			<p>W3School - 领先的Web技术教程站点</p>
			<p>在 W3School,你可以找到你所需要的所有网站假设教程。</p>
		</div>
		<p class="flip" onclick="clickp()">请点击这里</p>
		
		<p id="p5">默认情况下，所有的HTML元素的位置都是静态的，并且无法移动。如需对
		位置进行操作，记得首先把元素的CSS position属性设置为relative,fixed或absolute。</p>
		<div id="div4"></div>
		<button id="but6" type="button" onclick="animate()">开始动画</button>
		<button id="but7" type="button" onclick="BSanimate()">点击放大和缩小</button>
		
		<p>默认情况下，所有的HTML元素的位置都是静态的，并且无法移动。如需对
		位置进行操作，记得首先把元素的CSS position属性设置为relative,fixed或absolute。</p>
		<div id="div5">HELLO</div>
		<button id="but8" type="button" onclick="divContent()">点击放大</button>
	</body>
</html>
